<!--
 * @Author: yangzr 1076420747@qq.com
 * @Date: 2023-03-20 14:24:01
 * @LastEditors: yangzr 1076420747@qq.com
 * @LastEditTime: 2023-05-22 15:20:22
 * @FilePath: \ktgj-crm\src\views\jibenxinxi\membershipLnformation.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="bill">
    <div class="header">
      <div class="tabs">
        <div>
          <h4 style="margin: 0 0 10px 20px">基本信息</h4>
          <el-form
            :model="ruleForm"
            size="mini"
            ref="ruleForm"
            class="demo-ruleForm"
            label-width="85px"
            :rules="ruleFormRules"
          >
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                label="姓名"
                prop="userName"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.userName"></el-input>
              </el-form-item>
                 <el-form-item
                label="手机号 "
                prop="userAccount"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.userAccount"></el-input>
              </el-form-item>
             
              <el-form-item
                label="生日"
                prop="birthday"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-date-picker
                  size="mini"
                  v-model="ruleForm.birthday"
                  style="width: 180px"
                  type="date"
                  placeholder="选择日期"
                  value-format="yyyy-MM-dd"
                >
                </el-date-picker>
              </el-form-item>
                 
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
                <el-form-item
                label="年龄:"
                prop="birthday"
                style="display: flex; margin: 0 15px 0 0"
                
              >
                <el-input :value="ruleForm.birthday?getAge(ruleForm.birthday):''" disabled></el-input>

              </el-form-item>
              <el-form-item
                label="性别"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  v-model="ruleForm.userSex"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  clearable
                >
                  <el-option label="男" value="male"></el-option>
                  <el-option label="女" value="female"></el-option>
                </el-select>
              </el-form-item>
            </div>
 
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                label="常住地"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.residence"></el-input>
              </el-form-item>
              <el-form-item
                label="联系要求 "
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.requirement"></el-input>
              </el-form-item>
              <el-form-item
                label="微信号  "
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.userWechat"></el-input>
              </el-form-item>
           
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
              <!-- <el-form-item
                label="手机号2"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.phoneTwo"></el-input>
              </el-form-item> -->
              
              <el-form-item
                label="邮箱  "
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.userEmail"></el-input>
              </el-form-item>
                
              <el-form-item
                label="备注"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.remark"  style="width:400px"></el-input>
              </el-form-item>
            </div>
              <!-- <el-form-item
                label="注册时间 "
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-date-picker
                  size="mini"
                  v-model="ruleForm.createTime"
                  style="width: 180px"
                  type="date"
                  placeholder="选择日期"
                  value-format="yyyy-MM-dd"
                >
                </el-date-picker>
              </el-form-item> -->
           

            <h4 style="margin: 0 0 10px 20px">详细信息</h4>
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                label="国籍"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.nationality"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  filterable
                  clearable
                >
                  <el-option label="中国" value="中国"></el-option>
                  <el-option label="香港" value="香港"></el-option>
                  <el-option label="外国" value="外国"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="语种"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.language"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  clearable
                >
                  <el-option label="中文" value="中文"></el-option>
                  <el-option label="英文" value="英文"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="籍贯"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input
                  @input="inpChange($event)"
                  type="textarea"
                  :rows="1"
                  style="width: 180px"
                  v-model="ruleForm.nativePlace"
                ></el-input>
              </el-form-item>
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                label="民族"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.race"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  filterable
                  clearable
                >
                  <el-option label="未知" value="未知"></el-option>
                  <el-option label="汉族" value="汉族"></el-option>
                  <el-option label="蒙古族" value="蒙古族"></el-option>
                  <el-option label="回族" value="回族"></el-option>
                  <el-option label="藏族" value="藏族"></el-option>
                  <el-option label="维吾尔族" value="维吾尔族"></el-option>
                  <el-option label="苗族" value="苗族"></el-option>
                  <el-option label="壮族" value="壮族"></el-option>
                  <el-option label="布依族" value="布依族"></el-option>
                  <el-option label="朝鲜族" value="朝鲜族"></el-option>
                  <el-option label="满族" value="满族"></el-option>
                  <el-option label="彝族" value="彝族"></el-option>
                  <el-option label="侗族" value="侗族"></el-option>
                  <el-option label="瑶族" value="瑶族"></el-option>
                  <el-option label="白族" value="白族"></el-option>
                  <el-option label="土家族" value="土家族"></el-option>
                  <el-option label="哈尼族" value="哈尼族"></el-option>
                  <el-option label="哈萨克族" value="哈萨克族"></el-option>
                  <el-option label="傣族" value="傣族"></el-option>
                  <el-option label="黎族" value="黎族"></el-option>
                  <el-option label="僳僳族" value="僳僳族"></el-option>
                  <el-option label="佤族" value="佤族"></el-option>
                  <el-option label="畲族" value="畲族"></el-option>
                  <el-option label="回族" value="回族"></el-option>
                  <el-option label="高山族" value="高山族"></el-option>
                  <el-option label="拉祜族" value="拉祜族"></el-option>
                  <el-option label="水族" value="水族"></el-option>
                  <el-option label="东乡族" value="东乡族"></el-option>
                  <el-option label="纳西族" value="纳西族"></el-option>
                  <el-option label="景颇族" value="景颇族"></el-option>
                  <el-option label="柯尔克孜族" value="柯尔克孜族"></el-option>
                  <el-option label="土族" value="土族"></el-option>
                  <el-option label="达斡尔族" value="达斡尔族"></el-option>
                  <el-option label="仫佬族" value="仫佬族"></el-option>
                  <el-option label="羌族" value="羌族"></el-option>
                  <el-option label="布朗族" value="布朗族"></el-option>
                  <el-option label="撒拉族" value="撒拉族"></el-option>
                  <el-option label="毛南族" value="毛南族"></el-option>
                  <el-option label="仡佬族" value="仡佬族"></el-option>
                  <el-option label="锡伯族" value="锡伯族"></el-option>
                  <el-option label="阿昌族" value="阿昌族"></el-option>
                  <el-option label="普米族" value="普米族"></el-option>
                  <el-option label="塔吉克族" value="塔吉克族"></el-option>
                  <el-option label="怒族" value="怒族"></el-option>
                  <el-option label="乌孜别克族" value="乌孜别克族"></el-option>
                  <el-option label="俄罗斯族" value="俄罗斯族"></el-option>
                  <el-option label="鄂温克族" value="鄂温克族"></el-option>
                  <el-option label="德昂族" value="德昂族"></el-option>
                  <el-option label="保安族" value="保安族"></el-option>
                  <el-option label="裕固族" value="裕固族"></el-option>
                  <el-option label="京族" value="京族"></el-option>
                  <el-option label="塔塔尔族" value="塔塔尔族"></el-option>
                  <el-option label="独龙族" value="独龙族"></el-option>
                  <el-option label="鄂伦春族" value="鄂伦春族"></el-option>
                  <el-option label="赫哲族" value="赫哲族"></el-option>
                  <el-option label="门巴族" value="门巴族"></el-option>
                  <el-option label="珞巴族" value="珞巴族"></el-option>
                  <el-option label="基诺族" value="基诺族"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="血型"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.bloodType"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  filterable
                  clearable
                >
                  <el-option label="未知" value="未知"></el-option>
                  <el-option label="A型" value="A型"></el-option>
                  <el-option label="B型" value="B型"></el-option>
                  <el-option label="AB型" value="AB型"></el-option>
                  <el-option label="O型" value="O型"></el-option>
                  <el-option label="其他" value="其他"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="生肖"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.zodiac"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  filterable
                  clearable
                >
                  <el-option label="未知" value="未知"></el-option>
                  <el-option label="子鼠" value="子鼠"></el-option>
                  <el-option label="丑牛" value="丑牛"></el-option>
                  <el-option label="寅虎" value="寅虎"></el-option>
                  <el-option label="卯兔" value="卯兔"></el-option>
                  <el-option label="辰龙" value="辰龙"></el-option>
                  <el-option label="巳蛇" value="巳蛇"></el-option>
                  <el-option label="午马" value="午马"></el-option>
                  <el-option label="未羊" value="未羊"></el-option>
                  <el-option label="申猴" value="申猴"></el-option>
                  <el-option label="酉鸡" value="酉鸡"></el-option>
                  <el-option label="戌狗" value="戌狗"></el-option>
                  <el-option label="亥猪" value="亥猪"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                label="星座"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.constellation"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  clearable
                >
                  <el-option label="未知" value="未知"></el-option>
                  <el-option label="白羊座" value="白羊座"></el-option>
                  <el-option label="金牛座" value="金牛座"></el-option>
                  <el-option label="双子座" value="双子座"></el-option>
                  <el-option label="巨蟹座" value="巨蟹座"></el-option>
                  <el-option label="狮子座" value="狮子座"></el-option>
                  <el-option label="处女座" value="处女座"></el-option>
                  <el-option label="天秤座" value="天秤座"></el-option>
                  <el-option label="天蝎座" value="天蝎座"></el-option>
                  <el-option label="射手座" value="射手座"></el-option>
                  <el-option label="摩羯座" value="摩羯座"></el-option>
                  <el-option label="水瓶座" value="水瓶座"></el-option>
                  <el-option label="双鱼座" value="双鱼座"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item
                label="婚姻情况"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.marriage"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  clearable
                >
                  <el-option label="未知" value="未知"></el-option>
                  <el-option label="已婚" value="已婚"></el-option>
                  <el-option label="未婚" value="未婚"></el-option>
                  <el-option label="离异" value="离异"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="职业"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-select
                  @input="inpChange($event)"
                  v-model="ruleForm.occupation"
                  style="width: 180px"
                  placeholder="请选择活动区域"
                  clearable
                >
                  <el-option label="全日制学生" value="全日制学生"></el-option>
                  <el-option label="生产人员" value="生产人员"></el-option>
                  <el-option label="销售人员" value="销售人员"></el-option>
                  <el-option label="客服人员" value="客服人员"></el-option>
                  <el-option
                    label="行政/后勤人员"
                    value="行政/后勤人员"
                  ></el-option>
                  <el-option label="人力资源" value="人力资源"></el-option>
                  <el-option
                    label="财务/审计人员"
                    value="财务/审计人员"
                  ></el-option>
                  <el-option
                    label="文职/办事人员"
                    value="文职/办事人员"
                  ></el-option>
                  <el-option
                    label="技术/研发人员"
                    value="技术/研发人员"
                  ></el-option>
                  <el-option label="管理人员" value="管理人员"></el-option>
                  <el-option label="教师" value="教师"></el-option>
                  <el-option label="顾问/咨询" value="顾问/咨询"></el-option>
                  <el-option label="医护人员" value="医护人员"></el-option>
                  <el-option
                    label="政府工作人员(警察、公务员、法官等)"
                    value="政府工作人员(警察、公务员、法官等)"
                  ></el-option>
                  <el-option
                    label="专业认识(如会计师、建筑师、明星、记住等)"
                    value="专业认识(如会计师、建筑师、明星、记住等)"
                  ></el-option>
                  <el-option label="其他" value="其他"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                @input="inpChange($event)"
                label="职务"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.position"></el-input>
              </el-form-item>
              <el-form-item
                @input="inpChange($event)"
                label="客户喜好"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.hobby"></el-input>
              </el-form-item>

              <el-form-item
                @input="inpChange($event)"
                label="性格特征"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input v-model="ruleForm.personality"></el-input>
              </el-form-item>
            </div>

            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                @input="inpChange($event)"
                label="通讯地址"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input
                  type="textarea"
                  :rows="1"
                  style="width: 600px"
                  v-model="ruleForm.communication"
                ></el-input>
              </el-form-item>
            </div>
            <div style="display: flex; margin: 0 0 15px 0">
              <el-form-item
                @input="inpChange($event)"
                label="修改原因"
                style="display: flex; margin: 0 15px 0 0"
              >
                <el-input
                  type="textarea"
                  :rows="1"
                  style="width: 600px"
                  v-model="ruleForm.updateRemark"
                ></el-input>
              </el-form-item>
            </div>
            <div style="margin: 10px 0 10px 0">
              <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')"
                  >保存</el-button
                >
                <el-button type="primary" @click="returntop">返回</el-button>
              </el-form-item>
            </div>
          </el-form>
          <h4 style="margin: 0 0 10px 20px">会员卡信息</h4>
          <!-- 会员卡信息 -->
          <div style="max-width: 1400px">
            <el-table
              border
              :data="cardDetailsList"
              size="mini"
              :header-cell-style="{
                color: '#fff',
                background: '#6090EC',
                fontSize: '11px',
                fontWeight: 'normal',
              }"
              style="width: 100%"
            >
              <el-table-column
                prop="cardName"
                label="会员卡名称"
              ></el-table-column>
              <el-table-column prop="cardNumber" label="卡号"></el-table-column>
              <el-table-column
                prop="expireTime"
                label="过期时间"
              ></el-table-column>
              <!-- <el-table-column prop="cardType" label="卡类型" width="150"></el-table-column> -->
              <!-- <el-table-column prop="cardNum" label="卡号">
            </el-table-column>
            <el-table-column prop="name" label="持卡人姓名" width="130">
            </el-table-column>
            <el-table-column prop="cardSeller" label="售卡员" width="130">
            </el-table-column>
            <el-table-column prop="cardOpener" label="开卡人" width="110"></el-table-column> -->
              <!-- <el-table-column prop="date" label="售卡日期" width="150"> </el-table-column> -->
            </el-table>
          </div>
        </div>
      </div>
      <!-- 联系方式 -->
      <!-- <div style="margin:20px">
        <div class="tuo">
          <div class="tuo-1" style="margin:0 0 0 20px">
            <div class="tuo-2"></div>
            <span>联系方式列表</span>
          </div>
          <div class="tuo-3">
            <el-button @click="addcontactList" size="mini" style="
                width: 96px;
                font-size: 10px;
                color: #fff;
                height: 30px;
                background-color: #f6b23e;
              ">新增</el-button>
          </div>
        </div>
        <div class="table">
          <el-table border size="mini" ref="contact" :data="MembershipInformationData.contactInformations"
            :header-cell-style="{
              color: '#fff',
              background: '#6090EC',
              fontSize: '11px',
              fontWeight: 'normal',
            }" :row-style="{ height: '40px' }" tooltip-effect="dark" style="width: 100%">
            <el-table-column prop="contactInformationType" label="类型" width="120">
              <template slot-scope="scope">
                <template v-if="scope.row.contactInformationType == 'e-mail'">电子邮箱</template>
                <template v-if="scope.row.contactInformationType == 'phone'">电话</template>
              </template>
            </el-table-column>
            <el-table-column prop="contactInformationName" label="联系方式" width="180">
            </el-table-column>
            <el-table-column prop="contactInformationNameIllustrate" label="说明">
            </el-table-column>
            <el-table-column prop="name" label="操作" width="200">
              <template slot-scope="scope">
                <el-button style="background-color: #6090ec; color: #fff" size="mini" @click="btnModify(scope.row)">修改
                </el-button>

                <el-button @click="Deletephone(scope.row)" style="background-color: #ff0000; color: #fff" size="mini">删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div> -->
      <!-- 新增联系方式
      <el-dialog title=" 会员信息查询-新增联系方式" :visible.sync="phonesplaywindow" :close-on-click-modal="false" width="40%">
        <el-form size="mini" :inline="true" :model="addpassengers" :rules="addrules" ref="addpassengers"
          class="add_gers">
          <el-form-item label="联系类型" prop="contactInformationType" label-width="100px">
            <el-select v-model="addpassengers.contactInformationType" placeholder="请选择" clearable>
              <el-option v-for="item in fangshi" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="联系方式" prop="contactInformationName" label-width="100px">
            <el-input v-model="addpassengers.contactInformationName"></el-input>
          </el-form-item>
          <el-form-item label="说明" prop="contactInformationNameIllustrate" label-width="100px">
            <el-input type="textarea" v-model="addpassengers.contactInformationNameIllustrate"></el-input>
          </el-form-item><br />
          <el-form-item>
            <el-button type="primary" @click="getbackInsertConnect('addpassengers')" size="mini">确定
            </el-button>
            <el-button type="primary" @click="phonesplaywindow=false" size="mini">取消
            </el-button>
          </el-form-item>
        </el-form>
      </el-dialog>-->
      <!-- 删除 -->
      <!-- <el-dialog title="确认删除该联系方式吗" :visible.sync="Deletep" :close-on-click-modal="false" width="50%">
        <div class="pop-3">
          <el-button type="primary" @click="getbackDeleteConnect" size="mini">确定
          </el-button>
          <el-button type="primary" @click="Deletep=false" size="mini">取消
          </el-button>
        </div>
      </el-dialog>
      <el-dialog title="会员信息查询-修改联系方式" :visible.sync="editcontact" :close-on-click-modal="false" width="50%">

        <el-form size="mini" :inline="true" :model="addpassengers" :rules="addrules" class="add_gers">
          <el-form-item label="联系类型" prop="contactInformationType" label-width="100px">
            <el-select v-model="addpassengers.contactInformationType" placeholder="请选择" clearable>
              <el-option v-for="item in fangshi" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="联系方式" prop="contactInformationName" label-width="100px">
            <el-input v-model="addpassengers.contactInformationName"></el-input>
          </el-form-item>
          <el-form-item label="说明" prop="contactInformationNameIllustrate" label-width="100px">
            <el-input type="textarea" v-model="addpassengers.contactInformationNameIllustrate"></el-input>
          </el-form-item><br />
          <el-form-item>
            <el-button type="primary" @click="getbackUpdateConnectById('addpassengers')" size="mini">确定
            </el-button>
            <el-button type="primary" @click="editcontact=false" size="mini">取消
            </el-button>
          </el-form-item>
        </el-form>
      </el-dialog> -->

      <!-- 常旅客 -->
      <div style="margin: 20px 62px 100px 20px">
        <div class="tuo">
          <div class="tuo-1" style="margin-left: 15px">
            <div class="tuo-2"></div>
            <span>常旅客列表</span>
          </div>
          <div>
            <el-button @click="addFrequenflyer()" size="mini" type="primary"
              >新增
            </el-button>
          </div>
        </div>
        <!-- 常旅客列表 -->
        <div style="max-width: 1400px; margin-bottom: 20px">
          <el-table
            border
            :data="Frequenflyer"
            size="mini"
            :header-cell-style="{
              color: '#fff',
              background: '#6090EC',
              fontSize: '11px',
              fontWeight: 'normal',
            }"
            style="width: 980%; margin: 0 30px 0 20px"
          >
            <el-table-column prop="chineseName" label="是否是本人">
              <template slot-scope="scope">
                <template v-if="scope.row.isMe == 'yes'">本人</template>
              </template>
            </el-table-column>
            <el-table-column prop="passName" label="乘客名称">
            </el-table-column>
            <el-table-column prop="passSex" label="性别">
              <template slot-scope="scope">
                <template v-if="scope.row.passSex == 'male'">男</template>
                <template v-if="scope.row.passSex == 'female'">女</template>
              </template>
            </el-table-column>
            <el-table-column label="年龄" width="80">
              <template slot-scope="scope">{{
                getAge(scope.row.birthday)
              }}</template>
            </el-table-column>
            <el-table-column prop="certificateType" label="证件类型">
              <template slot-scope="scope">
                <template v-if="scope.row.certificateType == 'ZGJMSFZ'"
                  >身份证</template
                >
                <template v-if="scope.row.certificateType == 'MILITARY'"
                  >军人证</template
                >
                <template v-if="scope.row.certificateType == 'HZ'"
                  >护照</template
                >
                <template v-if="scope.row.certificateType == 'GAJMLWNDTXZ'"
                  >港澳居民来往内地通行证</template
                >
                <template v-if="scope.row.certificateType == 'TWJMLWDLTXZ'"
                  >台湾居民来往大陆通行证</template
                >
                <template v-if="scope.row.certificateType == 'WGRYJJLSFZ'"
                  >外国人永久居留身份证</template
                >
                <template v-if="scope.row.certificateType == 'GATJMJZZ'"
                  >港澳通行证</template
                >
                <template v-if="scope.row.certificateType == 'HKB'"
                  >户口本</template
                >
                <template v-if="scope.row.certificateType == 'BIRTH'"
                  >出生证明</template
                >
                <template v-if="scope.row.certificateType == 'TAIWAN_PASS'"
                  >台湾通行证</template
                >
              </template>
            </el-table-column>
            <el-table-column prop="certificateNumber" label="证件号码">
            </el-table-column>
            <el-table-column prop="certificateDate" label="证件过期时间">
            </el-table-column>
            <el-table-column prop="birthday" label="出生日期">
            </el-table-column>
            <el-table-column prop="nationalityName" label="国籍">
            </el-table-column>

            <el-table-column prop="passPhone" label="手机号码">
            </el-table-column>
            <el-table-column prop="name" label="操作" width="180px">
              <template slot-scope="scope">
                <el-button
                  style="background-color: #6090ec; color: #fff"
                  size="mini"
                  @click="Modifyddd(scope.row)"
                  >修改
                </el-button>
                <el-button
                v-if="scope.row.isMe != 'yes'"
                  @click="Deletepmethod(scope.row)"
                  style="background-color: #ff0000; color: #fff"
                  size="mini"
                  >删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <!-- 新增 -->
      <el-dialog
        title="会员信息查询-新增常旅客"
        :visible.sync="Frequentflierpopup"
        :close-on-click-modal="false"
        width="50%"
      >
        <el-form
          size="mini"
          :inline="true"
          ref="addpassengersData"
          :model="addpassengersData"
          :rules="addpassengersDatarules"
        >
          <el-form-item label="中文姓名" label-width="100px" prop="passName">
            <el-input
              v-model="addpassengersData.passName"
              size="mini"
            ></el-input>
          </el-form-item>
          <el-form-item label="英文姓" label-width="100px" prop="engSur">
            <el-input v-model="addpassengersData.engSur" size="mini"></el-input>
          </el-form-item>
          <el-form-item label="英文名" label-width="100px" prop="engName">
            <el-input
              v-model="addpassengersData.engName"
              size="mini"
            ></el-input>
          </el-form-item>
          <el-form-item label="是否本人" label-width="100px" prop="isMe">
            <el-radio-group v-model="addpassengersData.isMe">
              <el-radio label="yes">是</el-radio>
              <el-radio label="no">否</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="性别" label-width="100px" prop="passSex">
            <el-select
              v-model="addpassengersData.passSex"
              size="mini"
              clearable
              placeholder="请选择"
            >
              <el-option
                v-for="item in genderList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="手机号" label-width="100px" prop="passPhone">
            <el-input
              v-model="addpassengersData.passPhone"
              size="mini"
            ></el-input>
          </el-form-item>
          <el-form-item label="国籍" label-width="100px" prop="nationality">
            <el-select
              filterable
              v-model="addpassengersData.nationality"
              size="mini"
              placeholder="请选择"
              clearable
            >
              <el-option
                v-for="item in guoji"
                :key="item.nationalityCode"
                :label="item.nationalityName"
                :value="item.nationalityCode"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="证件类型"
            label-width="100px"
            prop="certificateType"
          >
            <el-select
              v-model="addpassengersData.certificateType"
              size="mini"
              placeholder="请选择"
              clearable
            >
              <el-option
                v-for="item in mold"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label="证件号"
            label-width="100px"
            prop="certificateNumber"
          >
            <el-input
              v-model="addpassengersData.certificateNumber"
              size="mini"
            ></el-input>
          </el-form-item>
          <el-form-item label="出生日期" label-width="100px" prop="birthday">
            <el-date-picker
              value-format="yyyy-MM-dd"
              size="mini"
              v-model="addpassengersData.birthday"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="证件有效期" label-width="100px">
            <el-date-picker
              value-format="yyyy-MM-dd"
              size="mini"
              v-model="addpassengersData.certificateDate"
              type="date"
              placeholder="选择日期"
            >
            </el-date-picker> </el-form-item
          ><br />
          <el-form-item>
            <el-button
              @click="getaddPass('addpassengersData')"
              size="mini"
              type="primary"
              >确定
            </el-button>
            <el-button
              @click="Frequentflierpopup = false"
              size="mini"
              type="primary"
              >取消
            </el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
    </div>
    <el-dialog
      title="确认删除该常旅客吗"
      :visible.sync="DeletepFrequentflyer"
      :close-on-click-modal="false"
      width="50%"
    >
      <div class="pop-3">
        <el-button
          @click="getbackDeleteDocuments"
          size="mini"
          style="
            width: 110px;
            font-size: 10px;
            color: #fff;
            height: 30px;
            background-color: #f6b23e;
          "
          >确定
        </el-button>
        <el-button
          @click="DeletepFrequentflyer = false"
          size="mini"
          type="primary"
          >取消
        </el-button>
      </div>
    </el-dialog>

    <!-- 修改
    <el-dialog
      title="修改常旅客信息"
      :close-on-click-modal="false"
      :visible.sync="ModifyFrequentflyer"
      width="50%"
    >
      <div class="header-1">
        <div class="too-1-1">
          <div class="too"></div>
          <span>修改常旅客</span>
        </div>
      </div>
      <el-form size="mini" :inline="true" :model="flierpopupList">
        <el-form-item label="中文姓名">
          <el-input v-model="ravelers.chineseName" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="英文姓名">
          <el-input v-model="ravelers.englishName" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="性别">
          <el-select
            v-model="ravelers.gender"
            size="mini"
            placeholder="请选择"
            clearable
          >
            <el-option
              v-for="item in genderList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="电话">
          <el-input v-model="ravelers.phone" size="mini"></el-input>
        </el-form-item>
        <el-form-item label="国籍">
          <el-select
            v-model="ravelers.nation"
            size="mini"
            placeholder="请选择"
            clearable
          >
            <el-option
              v-for="item in guoji"
              :key="item.nationalityCode"
              :label="item.nationalityName"
              :value="item.nationalityCode"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="证件类型">
          <el-select
            v-model="ravelers.certificateName"
            size="mini"
            placeholder="请选择"
            disabled
          >
            <el-option
              v-for="item in mold"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="证件号">
          <el-input
            v-model="ravelers.certificateNumcer"
            disabled
            size="mini"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="出生日期"
          v-if="ravelers.certificateName != 'ID_CARD'"
        >
          <el-date-picker
            value-format="yyyy-MM-dd"
            size="mini"
            v-model="ravelers.birthday"
            type="date"
            placeholder="选择日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="证件有效期">
          <el-date-picker
            size="mini"
            v-model="ravelers.certificateDate"
            disabled
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker> </el-form-item
        ><br />
        <el-form-item>
          <el-button
            @click="getbackUpdateCommonTravelers"
            size="mini"
            style="
              width: 110px;
              font-size: 10px;
              color: #fff;
              height: 30px;
              background-color: #f6b23e;
            "
            >确定
          </el-button>
          <el-button
            @click="ModifyFrequentflyer = false"
            size="mini"
            type="primary"
            >取消
          </el-button>
        </el-form-item>
      </el-form>
    </el-dialog> -->
  </div>
</template>

<script>
export default {
  name: "bill",
  components: {},
  data() {
    return {
      //会员卡信息
      cardDetailsList: [],
      // 会员id
      customerIdName: "",
      ruleForm: {
        // id:customerId,
        name: "",
        birthday: "",
        sex: "",
        licenseNum: "",
        phone: "",
        certificateType: "",
        validityPeriod: "",
        profession: "",
        jobTitle: "",
        characterTraits: "",
        customerPreferences: "",
        nationality: "",
        maritalStatus: "",
        constellation: "",
        chineseZodiac: "",
        language: "",
        countryCitizenship: "",
        contactRequest: "",
        mailingAddress: "",
        weChatNum: "",
        hometown: "",
        membershipLevel: null,
        bloodType: "",
        modifyReason: "",
        age: "",
        province: "",

        userName: "",
        userSex: "",
        residence: "",
        requirement: "",
        userAccount: "",
        phoneTwo: "",
        userWechat: "",
        userEmail: "",
        createTime: "",
        remark: "",

        nationality: "",
        language: "",
        nativePlace: "",
        race: "",
        bloodType: "",
        zodiac: "",
        constellation: "",
        marriage: "",
        occupation: "",
        position: "",
        hobby: "",
        personality: "",
        communication: "",
        updateRemark: "",
      },
      ruleFormRules: {
        userName: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
        ],
        userAccount: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
        ],
      },

      // 常旅客
      Frequentflierpopup: false,
      // 新增
      addpassengersData: {
        isMe: "yes",
        id: "",
        passName: "",
        nationality: "",
        passSex: "",
        birthday: "",
        passPhone: "",
        certificateType: "",
        certificateNumber: "",
        certificateDate: "",
        engSur: "",
        engName: "",
      },
      addpassengersDatarules: {
        passName: [
          {
            required: true,
            message: "请输入姓名",
            trigger: "change",
          },
        ],
        engSur: [
          {
            required: true,
            message: "请输入英文姓",
            trigger: "change",
          },
        ],
        engName: [
          {
            required: true,
            message: "请输入英文名",
            trigger: "change",
          },
        ],

        passSex: [
          {
            required: true,
            message: "请选择性别",
            trigger: "change",
          },
        ],
        isMe: [
          {
            required: true,
            message: "请选择性别",
            trigger: "change",
          },
        ],
        nationality: [
          {
            required: true,
            message: "请选择国籍",
            trigger: "change",
          },
        ],
        certificateType: [
          {
            required: true,
            message: "请选择证件类型",
            trigger: "change",
          },
        ],
        certificateNumber: [
          {
            required: true,
            message: "请输入证件号码",
            trigger: "change",
          },
        ],
        birthday: [
          {
            required: true,
            message: "请选择出生日期",
            trigger: "change",
          },
        ],
        certificateDate: [
          {
            required: true,
            message: "请选择证件有效期",
            trigger: "change",
          },
        ],
        passPhone: [
          {
            required: true,
            message: "请输入电话号码",
            trigger: "change",
          },
        ],
      },
      // 乘客类型
      passengertypeList: [
        {
          value: "aldult",
          label: "成人",
        },
        {
          value: "child",
          label: "儿童",
        },
        {
          value: "baby",
          label: "婴儿",
        },
      ],
      guoji: [],

      mold: [
        {
          value: "ZGJMSFZ",
          label: "中国居民身份证",
        },
        {
          value: "HZ",
          label: "护照",
        },
        {
          value: "DZHZ",
          label: "电子护照",
        },
        {
          value: "GATJMJZZ",
          label: "港澳台居民居住证",
        },
        {
          value: "GATXZ",
          label: "港澳通行证(包括电子港澳通行证)",
        },
        {
          value: "DLJMWLTWTXZ",
          label: "大陆居民往来台湾通行证",
        },
        {
          value: "MILITARY",
          label: "军官证",
        },

        {
          value: "GAJMLWNDTXZ",
          label: "港澳居民来往内地通行证",
        },

        {
          value: "TWJMLWDLTXZ",
          label: "台湾居民来往大陆通行证",
        },

        {
          value: "WGRYJJLSFZ",
          label: "外国人永久居留身份证",
        },

        {
          value: "BIRTH",
          label: "出生医学证明(十六周岁以下)",
        },
        {
          value: "HKB",
          label: "户口薄(十六周岁以下)",
        },

        {
          value: "OTHER",
          label: "其他证件",
        },
      ],
      genderList: [
        {
          value: "male",
          label: "男",
        },
        {
          value: "female",
          label: "女",
        },
      ],
      detele: "",
      DeletepFrequentflyer: false,
      ModifyFrequentflyer: false,
      // 修改
      ravelers: {
        commonTrvelersId: "",
        chineseName: "",
        englishName: "",
        gender: "",
        nation: "",
        birthday: "",
        phone: "",
        certificateNumcer: "",
        certificateName: "",
        certificateDate: "",
      },
      // 联系方式
      addpassengers: {
        contactInformationType: "",
        contactInformationName: "",
        contactInformationNameIllustrate: "",
      },
      phonesplaywindow: false,

      contactInformationId: "",
      // 删除弹窗
      Deletep: false,
      way: {},
      editcontact: false,

      disabled: true,
      Istrue: true,
      // 性别
      sexList: [
        {
          value: "male",
          label: "男",
        },
        {
          value: "female",
          label: "女",
        },
      ],
      // 不可修改
      nowrite: true,
      // 可修改
      canwrite: false,
      boxshow: false,
      activeName: "member",
      formLabelAlign: {
        name: "",
        checked: true,
      },
      radio: 3,
      checked: false,
      sizeForm: {
        name: "",
        region: "",
      },

      value: "",
      // 查询会员--身份证 会员卡
      memberData: {
        phone: "",
        idCode: "",
      },
      // 查询到的会员信息
      MembershipInformationData: {},
      // 查询到的会员信息列表
      MembershipInformation: {
        // 客户基本信息ID
        customerId: "",
        // 客户常用名
        customerName: "",
        // 性别
        customerSex: "",
        // 阳历生日日期
        birthday: "",
        // 联系方式
        custContactmeans: "",
        // 证件号码
        custCertificateNo: "",
        // 微信号码
        wechatId: "",
        // 通讯地址
        contractEmail: "",
        // 备注
        customerRemark: "",
      },
      // 查询当前会员的会员卡信息
      getMembershipData: [],
      type: "",
      showbaocun: "",
      Frequenflyer: [],
      gongdanList: [],
    };
  },
  mounted() {
    this.memberData.phone = this.$route.params.phone;
    //  this.type = this.$route.params.type;
    //  if(this.type = "2"){
    //    this.memberData.phone = this.$route.params.phone;
    //  }
    this.customerIdName = this.$route.params.customerId;
    console.log(this.memberData.phone);
    console.log(this.customerIdName);
    this.getcustomerDetailed();
    this.getqueryCustomer(this.customerIdName);
    // 查国籍
    this.queryNationalityList();
  },
  methods: {
    getAge(birthday) {
      if (birthday) {
        birthday = birthday.split("-");
        // 新建日期对象
        let date = new Date();
        // 今天日期，数组，同 birthday
        let today = [date.getFullYear(), date.getMonth() + 1, date.getDate()];
        // 分别计算年月日差值
        let age = today.map((val, index) => {
          return val - birthday[index];
        });
        // 当天数为负数时，月减 1，天数加上月总天数
        if (age[2] < 0) {
          // 简单获取上个月总天数的方法，不会错
          let lastMonth = new Date(today[0], today[1], 0);
          age[1]--;
          age[2] += lastMonth.getDate();
        }
        // 当月数为负数时，年减 1，月数加上 12
        if (age[1] < 0) {
          age[0]--;
          age[1] += 12;
        }
        console.log(age[0] + "岁" + age[1] + "月" + age[2] + "天");
        return age[0];
      }
    },
    // 保存按钮
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.getupdUserInfo();
          this.getaddUserInfoDetailed();
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 修改会员信息
    getupdUserInfo() {
      this.$axios
        .getupdUserInfo({
          id: this.customerIdName,
          userName: this.ruleForm.userName,
          phoneOne: this.ruleForm.phoneOne,
          phoneTwo: this.ruleForm.phoneTwo,
          userEmail: this.ruleForm.userEmail,
          userWechat: this.ruleForm.userWechat,
          userSex: this.ruleForm.userSex,
          birthday: this.ruleForm.birthday,
          residence: this.ruleForm.residence,
          remark: this.ruleForm.remark,
          requirement: this.ruleForm.requirement,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.$message({
              message: "修改基本信息成功",
              type: "success",
            });
            this.getcustomerDetailed();
          }
        });
    },
    // 修改会员详细信息
    getaddUserInfoDetailed() {
      this.$axios
        .getaddUserInfoDetailed({
          userId: this.customerIdName,
          nationality: this.ruleForm.nationality,
          language: this.ruleForm.language,
          nativePlace: this.ruleForm.nativePlace,
          race: this.ruleForm.race,
          bloodType: this.ruleForm.bloodType,
          zodiac: this.ruleForm.zodiac,
          constellation: this.ruleForm.constellation,
          marriage: this.ruleForm.marriage,
          occupation: this.ruleForm.occupation,
          position: this.ruleForm.position,
          hobby: this.ruleForm.hobby,
          personality: this.ruleForm.personality,
          communication: this.ruleForm.communication,
          updateRemark: this.ruleForm.updateRemark,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.$message({
              message: "修改详细信息成功",
              type: "success",
            });
            this.getcustomerDetailed();
          }
        });
    },
    // 查询用户信息
    getcustomerDetailed() {
      this.$axios
        .getqueryUserById({
          id: this.customerIdName,
        })
        .then((res) => {
          console.log(res);
          this.ruleForm = res.data.userInfo;
          this.cardDetailsList = res.data.userCardList;
          this.Frequenflyer = res.data.userPassengerList;
          this.ruleForm.nationality = res.data.userDetailInfo.nationality;
          this.ruleForm.language = res.data.userDetailInfo.language;
          this.ruleForm.nativePlace = res.data.userDetailInfo.nativePlace;
          this.ruleForm.race = res.data.userDetailInfo.race;
          this.ruleForm.bloodType = res.data.userDetailInfo.bloodType;
          this.ruleForm.zodiac = res.data.userDetailInfo.zodiac;
          this.ruleForm.constellation = res.data.userDetailInfo.constellation;
          this.ruleForm.marriage = res.data.userDetailInfo.marriage;
          this.ruleForm.occupation = res.data.userDetailInfo.occupation;
          this.ruleForm.position = res.data.userDetailInfo.position;
          this.ruleForm.hobby = res.data.userDetailInfo.hobby;
          this.ruleForm.personality = res.data.userDetailInfo.personality;
          this.ruleForm.communication = res.data.userDetailInfo.communication;
          this.ruleForm.updateRemark = res.data.userDetailInfo.updateRemark;
        });
    },
    // 返回上一页
    returntop() {
      // this.customerId=''
      this.$router.push({
        name: "queryCustomer",
      });
    },
    addFrequenflyer() {
      this.Frequentflierpopup = !this.Frequentflierpopup;
      this.addpassengersData = {};
      this.addpassengersData.id = "";
    },
    // 新增
    getaddPass(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.addpassengersData.id == "") {
            console.log(this.customerIdName);
            this.$axios
              .getaddPassenger({
                userId: this.customerIdName,
                isMe: this.addpassengersData.isMe,
                passName: this.addpassengersData.passName,
                nationality: this.addpassengersData.nationality,
                passSex: this.addpassengersData.passSex,
                birthday: this.addpassengersData.birthday,
                passPhone: this.addpassengersData.passPhone,
                certificateType: this.addpassengersData.certificateType,
                certificateNumber: this.addpassengersData.certificateNumber,
                certificateDate: this.addpassengersData.certificateDate,
                engSur: this.addpassengersData.engSur,
                engName: this.addpassengersData.engName,
              })
              .then((res) => {
                console.log(res);
                if (res.code == "00000") {
                  this.$refs[formName].resetFields();
                  this.$message({
                    message: "新增成功",
                    type: "success",
                  });
                  this.getcustomerDetailed();
                  this.Frequentflierpopup = false;
                } else {
                }
              });
          } else {
            this.$axios
              .getbackUpdateCommonTravelers({
                id: this.addpassengersData.id,
                userId: this.customerIdName,
                isMe: this.addpassengersData.isMe,
                passName: this.addpassengersData.passName,
                nationality: this.addpassengersData.nationality,
                passSex: this.addpassengersData.passSex,
                birthday: this.addpassengersData.birthday,
                passPhone: this.addpassengersData.passPhone,
                certificateType: this.addpassengersData.certificateType,
                certificateNumber: this.addpassengersData.certificateNumber,
                certificateDate: this.addpassengersData.certificateDate,
                engSur: this.addpassengersData.engSur,
                engName: this.addpassengersData.engName,
              })
              .then((res) => {
                console.log(res);
                if (res.code == "00000") {
                  this.$refs[formName].resetFields();
                  this.$message({
                    message: "修改成功",
                    type: "success",
                  });
                  this.getcustomerDetailed();
                  this.Frequentflierpopup = false;
                } else {
                }
              });
          }
        } else {
          return false;
        }
      });
    },
    Deletepmethod(row) {
      this.DeletepFrequentflyer = true;
      this.detele = row.id;
    },
    // 删除常旅客
    getbackDeleteDocuments() {
      this.$axios
        .getbackDeleteDocuments({
          id: this.detele,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.$message({
              message: "删除成功",
              type: "success",
            });
            this.getcustomerDetailed();
            this.DeletepFrequentflyer = false;
          }
        });
    },
    // 修改
    Modifyddd(row) {
      console.log(row);
      this.$axios
        .getbackSelectDocumentsById({
          id: row.id,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.Frequentflierpopup = !this.Frequentflierpopup;
            this.addpassengersData = res.data;
          }
        });
    },
    // 联系方式
    addcontactList() {
      this.phonesplaywindow = true;
      this.addpassengers.contactInformationType = "";
      this.addpassengers.contactInformationName = "";
      this.addpassengers.contactInformationNameIllustrate = "";
    },
    // input强制刷新
    inpChange(e) {
      this.$forceUpdate();
    },
    // 新增
    getbackInsertConnect(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$axios
            .getbackInsertConnect({
              contactInformationType: this.addpassengers.contactInformationType,
              contactInformationName: this.addpassengers.contactInformationName,
              contactInformationNameIllustrate:
                this.addpassengers.contactInformationNameIllustrate,
              customerId: this.MembershipInformationData.customerId,
            })
            .then((res) => {
              console.log(res);
              if (res.code == "200") {
                this.$message({
                  message: "新增成功",
                  type: "success",
                });
                this.addpassengers = {};
                this.getqueryCustomer();
                this.phonesplaywindow = false;
              }
            });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 删除
    Deletephone(row) {
      this.Deletep = true;
      this.contactInformationId = row.contactInformationId;
      console.log(this.contactInformationId);
    },
    getbackDeleteConnect() {
      console.log(this.contactInformationId);
      this.Deletep = false;
      this.$axios
        .getbackDeleteConnect({
          contactInformationId: this.contactInformationId,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "200") {
            this.$message({
              message: "删除成功",
              type: "success",
            });
            this.getqueryCustomer();
          } else {
            this.$confirm("删除失败请核对信息", "提示", {
              confirmButtonText: "确定",
              type: "warning",
            });
          }
        });
    },
    btnModify(row) {
      console.log(row);
      this.way = row;
      this.getbackUpdateConnect(row.contactInformationId);
      this.contactInformationId = row.contactInformationId;
    },
    getbackUpdateConnect(id) {
      console.log(id);
      this.$axios
        .getbackUpdateConnect({
          contactInformationId: id,
        })
        .then((res) => {
          if (res.code == "200") {
            console.log(res);
            this.addpassengers = res.data;
            this.editcontact = true;
          }
        });
    },

    // 会员信息查询
    getqueryCustomer(id) {
      console.log(this.memberData.phone);
      this.$axios
        .getqueryUserById({
          id: id ? id : this.customerIdName,
        })
        .then((res) => {
          if (res.code == "00000") {
            console.log(res);
            // MembershipInformationData->会员所有数据
            this.MembershipInformationData = res.data;
            console.log(this.MembershipInformationData);
            // MembershipInformation->页面绑定数据
            // 客户基本信息ID
            this.MembershipInformation.customerId = res.data.customerId;
            // 客户常用名
            this.MembershipInformation.customerName = res.data.customerName;
            // 性别
            this.MembershipInformation.customerSex = res.data.customerSex;
            // 阳历生日日期
            this.MembershipInformation.birthday = res.data.birthday;
            // 联系方式
            this.MembershipInformation.contractPhoneOne =
              res.data.contractPhoneOne;
            // 证件号码
            this.MembershipInformation.custCertificateNo =
              res.data.custCertificateNo;
            // 微信号
            this.MembershipInformation.wechatId = res.data.wechatId;
            // 通讯地址
            this.MembershipInformation.contractEmail = res.data.contractEmail;
            this.MembershipInformation.customerRemark = res.data.customerRemark;
            // 所在地区
            this.getMembership();
            this.getFather();
          } else {
            this.$message.error("查询会员不存在");
          }
        });
    },
    // 查国籍
    queryNationalityList() {
      this.$axios.queryNationalityList({}).then((res) => {
        if (res.code == "00000") {
          console.log(res);
          this.guoji = res.data;
        }
      });
    },
    // 会员卡信息查询
    getMembership() {
      this.$axios
        .getMembership({
          customerId: this.MembershipInformation.customerId,
        })
        .then((res) => {
          if (res.code == "200") {
            console.log(res.data);
            this.getMembershipData = res.data;
            console.log(this.getMembershipData);
          }
        });
    },

    // 子父传参
    getFather() {
      this.$emit(
        "goFather",
        this.MembershipInformationData,
        this.gongdanList,
        this.Frequenflyer
      );
    },
    save() {
      this.$emit("save");
    },
  },
};
</script>
<style scoped>
.CX {
  display: flex;
  font-size: 12px;
  padding: 20px;
}

.CX .CX-left {
  margin-left: 10px;
  margin-right: 10px;
}

.CX .CX-left input {
  margin-left: 20px;
  height: 28px;
  line-height: 28px;
  background-color: #fff;
  background-image: none;
  border-radius: 4px;
  border: 1px solid #dcdfe6;
  padding-left: 20px;
  outline: none;
}

.CX-btn {
  margin-left: 10px;
}

.bill {
  height: 100%;
  background-color: #f7f7f7;
}

.aa {
  display: flex;
}

.aa-1 {
  margin-left: 30px;
  margin-top: 22px;
  color: #f6b23e;
  font-size: 20px;
}

.bb {
  margin-left: 20px;
  margin-right: 20px;
}

.tuo {
  font-weight: bolder;
  display: flex;
  justify-content: space-between;
  margin-right: 20px;
}

.tuo0 {
  font-weight: bolder;
  display: flex;
  justify-content: space-between;
  margin-right: 20px;
  margin-left: 20px;
  margin-right: 20px;
}

.tuo-1 {
  display: flex;
}

.poo {
  display: flex;
  margin-right: 30px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.tuo-2 {
  width: 3.5px;
  height: 17px;
  background-color: #4b71bf;
  margin-top: 2px;
  margin-right: 4px;
  font-size: 12px;
  margin-bottom: 25px;
}

.table {
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.tabs {
  margin-left: 20px;
  margin-right: 20px;
  padding-top: 20px;
}

.add {
  width: 446px;
  height: 378px;
  background-color: #fff;
  border: 1px solid #c4c4c4;
}

.add1 {
  width: 620px;
  height: 770px;
  background-color: #fff;
  border: 1px solid #c4c4c4;
}

.pop-9 {
  font-size: 11px;
  width: 60px;
  padding-top: 5px;
}

.pop-7 {
  font-size: 11px;
  width: 55px;
  padding-top: 5px;
  margin-left: 10px;
}

.pop10 {
  font-size: 11px;
  width: 85px;
  padding-top: 5px;
  margin-left: 10px;
}

.pop-8 {
  font-size: 11px;
  width: 55px;
  padding-top: 5px;
}

.pop {
  margin-left: 30px;
}

.pop-1 {
  display: flex;
  width: 250px;
}

.pop-1-2 {
  display: flex;
  margin-bottom: 12px;
  margin-right: 10px;
}

.pop-2 {
  display: flex;
  margin-left: 20px;
  margin-bottom: 20px;
}

.pop-3 {
  margin-top: 20px;
}

.add-1 {
  display: flex;
  font-size: 11px;
  margin-bottom: 5px;
}

.add-1-2 {
  width: 48px;
  height: 48px;
  background-color: black;
  border-radius: 50%;
  margin-left: 10px;
}

.add-1-3 {
  margin-top: 15px;
  margin-left: 10px;
  color: #2f80ed;
}

.add-1-4 {
  font-size: 11px;
  color: #828282;
  margin-left: 80px;
  margin-bottom: 15px;
}

.pop-4 {
  font-size: 16px;
  font-weight: bolder;
  color: #ff0000;
}

.too-1-1 {
  display: flex;
  margin-left: 30px;
  padding-top: 20px;
  font-size: 20px;
}

.too {
  width: 3.5px;
  height: 22px;
  background-color: #4b71bf;
  margin-top: 2px;
  margin-right: 4px;
  margin-bottom: 25px;
}

.radio {
  margin-top: 5px;
}

.hackhome {
  border-top: 1px solid #e0e0e0;
  width: 97%;
  margin-left: 20px;
  margin-top: 20px;
  padding-bottom: 20px;
}

.xia {
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}

.pop {
  display: flex;
}

.xia-2 {
  margin-top: 40px;
  margin-left: 30px;
}

.you {
  margin-left: 30px;
}

.you-1 {
  font-size: 12px;
  font-weight: bolder;
  margin-bottom: 5px;
}

.you-2 {
  font-size: 11px;
  margin-bottom: 5px;
}

.you-2 > span {
  margin-right: 15px;
}

.you-3 {
  font-size: 11px;
}

.you-3 > span {
  font-size: 11px;
  color: #f06f2d;
  margin-left: 20px;
}

.you-4 {
  width: 88%;
  background-color: #e0e0e0;
  height: 36px;
  margin-left: 30px;
  margin-bottom: 20px;
}

.you-5 {
  width: 88%;
  height: 36px;
  margin-left: 30px;
  margin-bottom: 10px;
}

.you-4-1 {
  display: flex;
  padding-top: 4px;
  margin-left: 10px;
}

.you-4-2 {
  font-size: 11px;
  margin-top: 6px;
  padding-right: 10px;
}

.you6 {
  display: flex;
  margin-left: 10px;
  margin-top: 10px;
}

.you6-1 {
  display: flex;
  margin-right: 10px;
}

.you7 {
  margin-left: 30px;
  display: flex;
  font-size: 11px;
}

.you7-1 {
  margin-right: 10px;
}

.you8 {
  margin-left: 30px;
  margin-top: 30px;
}

.youu {
  margin-left: 10px;
}

.zui {
  margin-left: 20px;
  padding-bottom: 50px;
}

.table {
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
</style>